{% extends "base.html" %}

{% block head_extra %}
{% block form_media %}{{ form.media }}{% endblock %}
<script type="text/javascript" src="/static/js/jquery.js"></script>
<script type="text/javascript" src="/static/js/jquery.form.js"></script>
<script type="text/javascript">
{% if form_validate %}
function validated(data) {
  for (var field in data) {
    $("#error_" + field).text(data[field]);
  }
}
function validate(event) {
  $.post("{{ form_validate }}" + this.name + "/",
	 $("#id_form").formToArray(),
	 validated, "json");
}
{% endif %}

{% ifequal form_validate "/accounts/validate/" %}
function recommend(event) {
  if ($("#id_username").val()) return;
  first = $("#id_first_name").val();
  last = $("#id_last_name").val();
  username = first + last;
  username = username.toLowerCase();
  username = username.replace('Ä', 'ae');
  username = username.replace('Ö', 'oe');
  username = username.replace('Ü', 'ue');
  username = username.replace('ä', 'ae');
  username = username.replace('ö', 'oe');
  username = username.replace('ü', 'ue');
  username = username.replace('ß', 'ss');
  username = username.replace(/\W/g, '');
  $("#id_username").val(username);
}
{% endifequal %}

$(document).ready(function() {
  $("#id_{% block form_focus %}{{ form_focus }}{% endblock %}").focus();{% ifequal form_validate "/accounts/validate/" %}
  $("#id_username").focus(recommend);{% endifequal %}{% if form_validate %}
  $("input").keyup(validate);
  $("input").change(validate);{% endif %}
});
</script>
{% endblock head_extra %}

{% block title %}{{ form_title|capfirst }}{% endblock %}

{% block content %}
<h1>{% block form_title %}{{ form_title|capfirst }}{% endblock %}</h1>

{% block form_before %}{{ form_before|safe }}{% endblock %}

{% for key, error in form.errors.iteritems %}
{% ifequal key "__all__" %}<p class="error">{{ error.0 }}</p>{% endifequal %}
{% endfor %}

<form id="id_form" method="post" action="{{ form_action }}">
{% for field in form %}
<p>
<label for="id_{{ field.name }}">{{ field.label|capfirst }}:</label>
{{ field }}
<span id="error_{{ field.name }}" class="error">{{ field.errors.0 }}</span>
</p>
{% endfor %}
<p>
{% block form_hidden %}{{ form_hidden|safe }}{% endblock %}
<input type="submit" id="id_submit" name="submit" value="{% block form_submit %}{% if form_submit %}{{ form_submit|capfirst }}{% else %}Submit{% endif %}{% endblock %}" />
</p>
</form>

{% block form_after %}{{ form_after|safe }}{% endblock %}
{% endblock content %}
